<template>
  <div class="welcome" v-loading.fullscreen.lock="loading">
    <template v-if="isShow">
      <div class="welcome-header">
        <span>{{timeStr}}好：{{pathArr.join(' - ')}}</span>
      </div>
      <div class="welcome-content">{{welcomeText}}</div>
    </template>
  </div>
</template>

<script>
  import LoginApi from 'services/loginApi';

  import SystemUtil from 'utils/systemUtil';

  export default {
    props: {
      user: {
        type: Object,
        required: true
      }
    },

    computed:{
      pathArr(){
        let user = this.user;
        let arr = [user.branchName];

        let partnerName = user.partnerName;
        if (!SystemUtil.isEmpty(partnerName)) {
          arr.push(partnerName);
        }
        arr.push(user.name);
        return arr;
      }
    },

    data() {
      return {
        loading: false,
        isShow: false,
        welcomeText: '',
        timeStr: ''
      };
    },

    created() {
      this.setWelcomeText();
    },

    methods: {
      setWelcomeText() {
        this.loading = true;
        LoginApi.getInspirationalText().then(res => {
          let time = res.time;
          let hour = this.$moment(time).hour();
          let timeStr = '';
          if (hour > 18 || hour < 6) {
            timeStr = '晚上';
          } else if (hour < 8) {
            timeStr = '早晨';
          } else if (hour < 11) {
            timeStr = '上午';
          } else if (hour < 13) {
            timeStr = '中午';
          } else {
            timeStr = '下午';
          }
          this.timeStr = timeStr;
          this.welcomeText = res.text;

          this.loading = false;
          this.isShow = true;
        }).catch(() => {
          this.loading = false;
          this.isShow = true;
        });
      }
    }
  };

</script>

<style lang="scss" scoped>
  .welcome {
    padding: 10px;
    height: calc(100% - 20px);
    background: #f1f3f4;

    .welcome-header {
      font-size: 18px;
    }
    .welcome-content{
      margin-top: 100px;
      font-size: 20px;
      padding: 0 20px;
    }
  }

</style>
